<template> <div class="page-container">
  <div class="toolbar">
     <el-row>
      <el-tabs type="border-card">
       <el-tab-pane label="基本信息">
       <el-form :inline="true" :model="dataForm" label-width="125px" style="text-align:left;" ref="dataForm" :rules="dataFormRules" :disabled="this.$route.query.disabled" class="form">
       <el-row style="margin-top: -20px;" class="searchDialog-input">
       <el-divider content-position="center">
        <span style="font-size:16px;font-weight:800">基本信息</span>
       </el-divider>

       <el-form-item label="主键：" v-show="false">
        <el-input v-model="dataForm.id" placeholder="请输入" ></el-input>
       </el-form-item>
       <el-form-item label="合同编码：" prop="contractCode">
        <el-input v-model="dataForm.contractCode" placeholder="请输入"></el-input>
       </el-form-item>
       <!-- <el-form-item label="采购单类型">
        <el-select v-model="dataForm.busiType" placeholder="请输入">
          	<el-option label="采购单" value=1></el-option>
            <el-option label="补货单" value=2></el-option>
            <el-option label="退货单" value=3></el-option>
            <el-option label="无采购收货单" value=4></el-option>
        </el-select>
       </el-form-item> -->

       <el-form-item label="币别：" prop="tradeCurrency">
        <el-select v-model="dataForm.tradeCurrency" placeholder="请输入">
            <el-option label="人民币" value='CNY'></el-option>
            <el-option label="美元" value='USD'></el-option>
        </el-select>
       </el-form-item>
       <el-form-item label="产品名称：" prop="productCode">
        <el-select v-model="dataForm.productCode" placeholder="请输入">
              <el-option
                v-for="item in productCodeOption"
                :key="item.code"
                :label="item.label"
                :value="item.value">
              </el-option>
        </el-select>
       </el-form-item>

       <el-form-item label="置换率：" prop="exchangeRate">
        <el-input v-model="dataForm.exchangeRate" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="条形码：" prop="productBarNo">
        <el-input v-model="dataForm.productBarNo" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="产品规格：" prop="productSize">
        <el-input v-model="dataForm.productSize" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="税率：" prop="taxRate">
        <el-input v-model="dataForm.taxRate" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="最小采购量：" prop="minNum">
        <el-input v-model="dataForm.minNum" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="最大采购量：" prop="maxNum">
        <el-input v-model="dataForm.maxNum" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="是否包邮：" prop="hasTransportPrice">
         <!-- ：0-不含；1-包含； -->
        <el-select v-model="dataForm.hasTransportPrice" placeholder="请输入">
          <el-input></el-input>
        </el-select>
       </el-form-item>
       <el-form-item label="转换率：" prop="transferRate">
        <el-input v-model="dataForm.transferRate" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="运费：" prop="transportPrice">
        <el-input v-model="dataForm.transportPrice" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="原税率：" prop="originTaxRate">
        <el-input v-model="dataForm.originTaxRate" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="原不含税价格：" prop="originAmountWithoutTax">
        <el-input v-model="dataForm.originAmountWithoutTax" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="原含税价格：" prop="originAmountWithTax">
        <el-input v-model="dataForm.originAmountWithTax" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="原起订量：" prop="originMinNum">
        <el-input v-model="dataForm.originMinNum" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="原最大订货量：" prop="originMaxNum">
        <el-input v-model="dataForm.originMaxNum" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="原运输方式：" prop="originTransportType">
         <!-- （1-铁路；2-空运；3-公路；4-河运；5-海运；6-其他） -->
        <el-input v-model="dataForm.originTransportType" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="原是否包含运费：" prop="originHasTransportPrice">
         <!-- (0-不含；1-包含) -->
        <el-input v-model="dataForm.originHasTransportPrice" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="创建时间：" prop="createTime">
        <el-input v-model="dataForm.createTime" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="修改时间：" prop="updateTime">
        <el-input v-model="dataForm.updateTime" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="创建人Id：" prop="creater">
        <el-input v-model="dataForm.creater" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="修改人Id：" prop="updator">
        <el-input v-model="dataForm.updator" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="创建人姓名：" prop="createrName">
        <el-input v-model="dataForm.createrName" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="修改人姓名：" prop="updatorName">
        <el-input v-model="dataForm.updatorName" placeholder="请输入"></el-input>
       </el-form-item>
       <el-form-item label="状态：" prop="status">
        <el-input v-model="dataForm.status" placeholder="请输入"></el-input>
       </el-form-item>
       <!-- <el-form-item label="删除标志：" prop="deleteFlag">  -->
         <!-- 0-未删除；1-已删除； -->
        <!-- <el-input v-model="dataForm.deleteFlag" placeholder="请输入"></el-input>
       </el-form-item>-->
       </el-row>
      </el-form>
      <div class="tool-wrap">
       <div class="left-area">
        <el-button-group>
         <el-button type="primary" size="small" @click="submitForm()" v-show="!this.$route.query.disabled">保存</el-button>
         <el-button type="primary" size="small" @click="$router.go(-1)">取消</el-button>
        </el-button-group>
       </div>
      </div>
     </el-tab-pane>
    </el-tabs>
   </el-row>
  </div>
 </div>
</template>
<script>
//一.导包区
import {mapState} from "vuex";
import ThemePicker from "@/components/ThemePicker";
import LangSelector from "@/components/LangSelector";
import VDistpicker from 'v-distpicker';
import elTree from '@/views/tree/src/tree.vue'

//二.数据输出区
export default {

//2.1 注册组件
components: {
 ThemePicker,
 LangSelector,
 VDistpicker,
 elTree,
},

//2.2 数据初始化区
data() {
 return {

  //2.2.1 公共数据初始化
  searchSize: 'mini',

// 2.2.2 form 表单数据初始化
  dataForm: {
    id:null,
   contractCode:null,
   busiType:null,
   busiCode:null,
   supplierCode:null,
   supplierName:null,
   puchaseNum:null,
   tradeCurrency:null,
   productCode:null,
   productName:null,
   productUnit:null,
   exchangeRate:null,
   productBarNo:null,
   productSize:null,
   taxRate:null,
   minNum:null,
   maxNum:null,
   hasTransportPrice:null,
   transferRate:null,
   transportPrice:null,
   originTaxRate:null,
   originAmountWithoutTax:null,
   originAmountWithTax:null,
   originMinNum:null,
   originMaxNum:null,
   originTransportType:null,
   originHasTransportPrice:null,
   createTime:null,
   updateTime:null,
   creater:null,
   updator:null,
   createrName:null,
   updatorName:null,
   status:null,
   deleteFlag:null,
},
//trigger 为blur 表示丢失焦点;为change 表示值发生变化;
  dataFormRules: {
   id:[
   { required: false, message: "请输入主键", trigger: "blur" },
   { min: 0, max: 20, message: "长度在 0 到 20 个字符", trigger: "blur" },
   ],
   contractCode:[
   { required: true, message: "请输入合同编码", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   busiType:[
   { required: true, message: "采购单类型", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   busiCode:[
   { required: true, message: "采购单编码", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   supplierCode:[
   { required: true, message: "请输入采购单编码", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   supplierName:[
   { required: true, message: "请输入采购单名称", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   puchaseNum:[
   { required: true, message: "请输入采购数量", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   tradeCurrency:[
   { required: true, message: "请输入交易币别", trigger: "blur" }, //,CNY-人民币;USD-美元....
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   productCode:[
   { required: true, message: "请输入产品名称", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   productName:[
   { required: true, message: "请输入产品名称", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   productUnit:[
   { required: true, message: "请输入产品单位", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   exchangeRate:[
   { required: true, message: "请输入置换率", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   productBarNo:[
   { required: true, message: "请输入条形码", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   productSize:[
   { required: true, message: "请输入产品规格", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   taxRate:[
   { required: true, message: "请输入税率", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   minNum:[
   { required: true, message: "请输入最小采购量", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   maxNum:[
   { required: true, message: "请输入最大采购量", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   hasTransportPrice:[
   { required: true, message: "请输入是否包邮", trigger: "blur" }, //：0-不含；1-包含；
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   transferRate:[
   { required: true, message: "请输入转换率", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   transportPrice:[
   { required: true, message: "请输入运费", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   originTaxRate:[
   { required: true, message: "请输入原税率", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   originAmountWithoutTax:[
   { required: true, message: "请输入原不含税价格；", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   originAmountWithTax:[
   { required: true, message: "请输入原含税价格；", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   originMinNum:[
   { required: true, message: "请输入原起订量", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   originMaxNum:[
   { required: true, message: "请输入原最大订货量", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   originTransportType:[
   { required: true, message: "请输入原运输方式", trigger: "blur" }, //（1-铁路；2-空运；3-公路；4-河运；5-海运；6-其他）
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   originHasTransportPrice:[
   { required: true, message: "请输入原是否包含运费(0-不含；1-包含)", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   createTime:[
   { required: true, message: "请输入创建时间", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   updateTime:[
   { required: true, message: "请输入修改时间", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   creater:[
   { required: true, message: "请输入创建人Id", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   updator:[
   { required: true, message: "请输入修改人Id", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   createrName:[
   { required: true, message: "请输入创建人姓名", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   updatorName:[
   { required: true, message: "请输入修改人姓名", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   status:[
   { required: true, message: "请输入状态", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
   deleteFlag:[
   { required: true, message: "请输入删除标志：0-未删除；1-已删除；", trigger: "blur" },
   { min: 0, min: 100, message: "长度在 0 到 100 个字符", trigger: "blur" },
   ],
},
   //dialogVisible: false, //// 是否显示弹窗内容;
   //editDialogVisible1: false,//// 是否可编辑弹窗内容;
   //editLoading: false,////是否显示加载时动画效果;

  productCodeOption : {},//产品下拉数据




   }//return 完结;
  },//data()方法 完结;

//2.3 Vue 方法区
methods: {
//2.3.1 公共方法区

//2.请求列表数据
getDetail() {
 let this_ = this;
 if (this.$route.query != null && this.$route.query.id != null && this.$route.query.id != '' && this.$route.query.id != 'null' && this.$route.query.id != "undefined") {
  let params = {};
  params.id = this.$route.query.id;
  params.busiType = this.$route.query.busiType;
  this.utils.request.getPurchasePriceDetail(params, function (res) {
  if (res.code === "0000") {
   this_.dataForm = res.data;
  } else {
   this_.$message({message: "操作失败, " + data.msg, type: "error"});
   }
  });
 }
},

submitForm: function() {
  let this_ = this;
  this_.$refs.dataForm.validate(valid => {
  if (valid) {
   this_.$confirm("确认提交吗？", "提示", {}).then(() => {
     this_.editLoading = true;
     let params = this.dataForm;
     params.busiType = this.$route.query.busiType;

     this_.utils.request.savePurchasePrice(params, function (res) {
     if (res.code === "0000") {
        this_.$message({message: "操作成功", type: "success"});
     } else {
         this_.$message({message: "操作失败", type: "error"});
     }
     });
     this_.$router.go(-1);
  });
  }
  });
},
// 7.页面弹窗处理方法
add() {
this.dialogVisible = true;
},

// 8.关闭弹窗
handleClose() {
this.dialogVisible = false;
},

/*图片预览*/
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
/*图片移除*/
handleRemove(file, fileList) {
console.log(file, fileList);
},
back(){
    this.$router.go(-1);
},
//==========2.3.1 JavaScript 自定义方法区==========





},
//1.初始化页面调用方法(dom元素绑定后再执行初始化数据操作)
mounted() {
 this.getDetail();
},

}
</script>
<style lang="scss" scoped>
  /* ele组件样式重置 */
  .common-content {
    padding: 10px;
    box-sizing: border-box;

    .search-wrap /deep/ {
      .el-form-item__label {
        height: 32px;
        line-height: 32px;
      }

      .el-form-item__content {
        height: 32px;
        line-height: 32px;
        width: 150px;
      }

      .el-input--mini .el-input__inner {
        height: 32px;
        line-height: 32px;
      }

      .el-date-editor.el-input, .el-date-editor.el-input__inner {
        width: 150px;
      }
    }

    /* 多日期样式重置 */
    .el-dater /deep/ .el-form-item__content {
      width: 330px;
    }

    /* 通用工具部分样式 */
    .tool-wrap {
      width: 100%;
      height: auto;
      position: relative;
      overflow: hidden;

      .left-area {
        float: left;
        width: 50%;
        text-align: left;

        button {
          margin-right: 15px;
          border-radius: 5px;
        }
      }

      .right-area {
        float: right;
        width: 50%;
        text-align: right;
      }
    }

    /* 表格部分样式 */
    .table-wrap {
      width: 100%;
      max-height: 600px;
      margin-top: 20px;
    }

    /* 弹窗样式 */
    .dialog-wrap /deep/ .el-dialog__footer {
      text-align: center !important;
    }
  }
</style>
